﻿<script src="~/lib/jquery/dist/jquery.js"></script>
<script>
    $(function () {
        TimeDown("timer", @ViewData["RemainTime"])
    });

    function TimeDown(id, value) {
        var totalSeconds = parseInt(value); //倒计时的总秒数
        if (totalSeconds <= 0) {
            document.getElementById(id).innerHTML = "已成功完成学习";
        } else {
            var modulo = totalSeconds % (60 * 60 * 24); //取模（余数）
            var hours = Math.floor(modulo / (60 * 60)); //小时数
            modulo = modulo % (60 * 60);
            var minutes = Math.floor(modulo / 60); //分钟
            var seconds = modulo % 60; //秒

            hours = hours.toString().length == 1 ? '0' + hours : hours;
            minutes = minutes.toString().length == 1 ? '0' + minutes : minutes;
            seconds = seconds.toString().length == 1 ? '0' + seconds : seconds;

            //输出到页面
            document.getElementById(id).innerHTML = "距离学习结束" + hours + "时" + minutes + "分" + seconds + "秒";
            //延迟一秒执行自己
            if (hours == "00" && minutes == "00" && parseInt(seconds) - 1 < 0) {

            } else {
                setTimeout(function () {
                    TimeDown(id, value - 1);
                }, 1000)
            }
        }
    }
</script>


<div class="layui-row">
    <blockquote class="layui-elem-quote layui-bg-green" id="timer">
    </blockquote>
</div>

<div class="layui-carousel" id="test1">
    <div carousel-item>
        @{ var picList = ViewData["PicList"] as List<string>;}
        @{ foreach (var item in picList)
            {
                <div><img src="@item" width="1200px" height="470px" /></div>
            }
        }
    </div>
</div>

<script type="text/javascript" src="~/layui/layui.js"></script>
<script>
    layui.use('carousel', function () {
        var carousel = layui.carousel;
        //建造实例
        carousel.render({
            elem: '#test1'
            , width: '100%' //设置容器宽度
            , height: '470px'
            , arrow: 'always' //始终显示箭头
            //,anim: 'updown' //切换动画方式
        });
    });
</script>